<template>
  <div class="register-box">
    <div class="header">
      <van-nav-bar title="注册" left-arrow @click-left="$router.back()"> </van-nav-bar>
    </div>
    <div class="content">
      <van-form @submit="onSubmit">
        <van-field
          v-model="username"
          placeholder="请输入手机号"
          clearable
          @input="check"
        />
        <div style="margin: 16px 0">
          <van-button
            type="Info"
            round
            block
            native-type="submit"
            color="linear-gradient(to right, #ff6034, #ee0a24)"
            :disabled="disabled_flag"
            >下一步</van-button
          >
        </div>
      </van-form>
    </div>
  </div>
</template>

<script>
export default {
  name: "RegisterPage",
  data() {
    return {
      username: "",
      disabled_flag: true,
    };
  },
  methods: {
    check() {
      let reg = new RegExp(
        /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/
      );
      if (reg.test(this.username)) {
        this.disabled_flag = false;
      } else {
        this.disabled_flag = true;
      }
    },
    onSubmit() {
      this.$http({
        url: "user/docheckphone",
        method: "post",
        data: `tel=${this.username}`,
      }).then((res) => {
        if (res.data.code == "10005") {
          this.$dialog
            .confirm({
              message: "该手机号已被注册,请直接登录",
              confirmButtonText: "立即登录",
            })
            .then(() => {
              this.$router.push("/login");
            })
            .catch(() => {
              // on cancel
            });
        } else if (res.data.code == "200") {
          sessionStorage.setItem("tel", this.username);
          this.$router.push("register/sms");
        }
      });
    },
  },
};
</script>

<style scoped>
.content {
  padding: 35px 15px;
}
.van-button {
  margin-top: 3.4375rem;
}
</style>